<template>
	<view class="content">
		<view class="list-box">
			<view class="title">
				打款详情
			</view>
			<view class="item-box" v-if="infoDetil.applyTime">
				<view class="title">
					申请时间
				</view>
				<view class="text">
					{{infoDetil.applyTime}}
				</view>
			</view>
			<view class="item-box" v-if="infoDetil.totalMoney">
				<view class="title">
					申请金额
				</view>
				<view class="text">
					{{infoDetil.totalMoney}}
				</view>
			</view>
			<view class="item-box" v-if="infoDetil.remainMoney">
				<view class="title">
					剩余金额
				</view>
				<view class="text">
					{{infoDetil.remainMoney}}
				</view>
			</view>
			<view class="item-box" v-if="infoDetil.paidMoney">
				<view class="title">
					支付金额
				</view>
				<view class="text">
					{{infoDetil.paidMoney}}
				</view>
			</view>
			<view class="item-box" v-if="infoDetil.applyTime">
				<view class="title">
					申请金额
				</view>
				<view class="text">
					{{infoDetil.applyTime}}
				</view>
			</view>
			<view class="item-box" v-if="infoDetil.supplierName">
				<view class="title">
					供应商名称
				</view>
				<view class="text">
					{{infoDetil.supplierName}}
				</view>
			</view>
			<view class="item-box" v-if="infoDetil.bankName">
				<view class="title">
					供应商银行
				</view>
				<view class="text">
					{{infoDetil.bankName}}
				</view>
			</view>
			<view class="item-box" v-if="infoDetil.bankNo">
				<view class="title">
					供应商行号
				</view>
				<view class="text">
					{{infoDetil.bankNo}}
				</view>
			</view>
			<view class="item-box" v-if="infoDetil.accountNo">
				<view class="title">
					供应商账号
				</view>
				<view class="text">
					{{infoDetil.accountNo}}
				</view>
			</view>
			<view class="item-box">
				<view class="title">
					审核状态
				</view>
				<view class="text" v-if="infoDetil.assessStatus == 0">
					待审计
				</view>
				<view class="text" v-if="infoDetil.assessStatus == 1">
					审计退回
				</view>
				<view class="text" v-if="infoDetil.assessStatus == 2">
					待审核
				</view>
				<view class="text" v-if="infoDetil.assessStatus == 3">
					已拒审
				</view>
				<view class="text" v-if="infoDetil.assessStatus == 4">
					审核通过
				</view>
			</view>
			<view class="item-box" v-if="infoDetil.assessStatus">
				<view class="title">
					支付状态
				</view>
				<view class="text" v-if="infoDetil.payStatus == 0">
					未付款
				</view>
				<view class="text" v-if="infoDetil.payStatus == 1">
					部分付款
				</view>
				<view class="text" v-if="infoDetil.payStatus == 2">
					已付款
				</view>
			</view>

			<view class="item-box" v-if="infoDetil.invoiceCode" @click="payApplyAssess()">
				<view class="title">
					发票编号
				</view>
				<view class="text">
					{{infoDetil.invoiceCode}}
				</view>
			</view>
			<view class="item-box" v-if="infoDetil.invoicePhoto">
				<view class="title">
					发票照片
				</view>
				<view class="">
					<view v-for="(photo, index) in invoicePhotoList" :key="index" >
							<view style="color: blue;width: 300rpx;height: 150rpx;overflow: hidden;">
								<span @click="pdfBnt(photo)">点击查看发票</span>
							</view>
							<!-- <image v-else style="width: 200rpx;height: 200rpx;" mode="aspectFit"
								:src="baseUrl + photo" @click="pdfBnt(photo)"></image> -->
					</view>
				</view>
			</view>
			<view class="item-box" v-if="infoDetil.auditBy">
				<view class="title">
					审计人
				</view>
				<view class="text">
					{{infoDetil.auditBy}}
				</view>
			</view>
			<view class="item-box" v-if="infoDetil.auditTime">
				<view class="title">
					审计时间
				</view>
				<view class="text">
					{{dateFormat(infoDetil.auditTime)}}
				</view>
			</view>
			<view class="item-box" v-if="infoDetil.auditOpinion">
				<view class="title">
					审计意见
				</view>
				<view class="text">
					{{infoDetil.auditOpinion}}
				</view>
			</view>
			<view class="item-box" v-if="infoDetil.auditByphoto" @click="pdfBnt(infoDetil.auditByphoto)">
				<view class="title">
					审计人签字
				</view>
				<view class="text">
					<image style="width: 200rpx;height: 200rpx;;transform: rotate(270deg);" mode="aspectFit"
						:src="baseUrl + infoDetil.auditByphoto"></image>
				</view>
			</view>
			<view class="item-box" v-if="infoDetil.assessBy">
				<view class="title">
					审核人
				</view>
				<view class="text">
					{{infoDetil.assessBy}}
				</view>
			</view>
			<view class="item-box" v-if="infoDetil.assessTime">
				<view class="title">
					审核时间
				</view>
				<view class="text">
					{{dateFormat(infoDetil.assessTime)}}
				</view>
			</view>
			<view class="item-box" v-if="infoDetil.assessOpinion">
				<view class="title">
					审核意见
				</view>
				<view class="text">
					{{infoDetil.assessOpinion}}
				</view>
			</view>
			<view class="item-box" v-if="infoDetil.assessByphoto" @click="pdfBnt(infoDetil.assessByphoto)" >
				<view class="title">
					审核人签字
				</view>
				<view class="text">
					<image style="width: 200rpx;height: 200rpx;transform: rotate(270deg);"  mode="aspectFit"
						:src="baseUrl + infoDetil.assessByphoto"></image>
				</view>
			</view>
		</view>
		<!-- <view class="bottom-box" v-if="infoDetil.assessStatus == 0">
			<view class="bnt" @click="inputDialogToggle('同意')">
				同意
			</view>
			<view class="bnt" @click="inputDialogToggle('拒绝')">
				拒绝
			</view>
		</view> -->
		<uni-popup ref="inputDialog" type="dialog">
			<uni-popup-dialog ref="inputClose" mode="input" :title="text" value="" placeholder="请输入备注"
				@confirm="dialogInputConfirm"></uni-popup-dialog>
		</uni-popup>
	</view>
</template>

<script>
	import config from '@/config'
	import {
		payApplyDetil,
		payApplyEdit
	} from "@/api/system/index"
	const baseUrl = config.baseUrl
	export default {
		data() {
			return {
				invoicePhotoList:[],
				baseUrl: config.baseUrl,
				id: '',
				text: '',
				infoDetil: {}
			}
		},
		onLoad(e) {
			this.id = e.id
			this.info()
		},
		methods: {
			// timestampToTemplate(timestamp) {
			// 	    const date = new Date(timestamp);
			// 	    const year = date.getFullYear();
			// 	    const month = String(date.getMonth() + 1).padStart(2, '0'); // 月份是从 0 开始的，所以要加 1
			// 	    const day = String(date.getDate()).padStart(2, '0');
			// 	    console.log(`年: ${year}`);
			// 	    console.log(`月: ${month}`);
			// 	    console.log(`日: ${day}`);
			//   return `${year}-${month}-${day}` ;
			// },
			dateFormat(time) {
				let date = new Date(time);
				let year = date.getFullYear();
				// 在日期格式中，月份是从0开始的，因此要加0，使用三元表达式在小于10的前面加0，以达到格式统一  如 09:11:05
				let month = date.getMonth() + 1 < 10 ? "0" + (date.getMonth() + 1) : date.getMonth() + 1;
				let day = date.getDate() < 10 ? "0" + date.getDate() : date.getDate();
				let hours = date.getHours() < 10 ? "0" + date.getHours() : date.getHours();
				let minutes = date.getMinutes() < 10 ? "0" + date.getMinutes() : date.getMinutes();
				let seconds = date.getSeconds() < 10 ? "0" + date.getSeconds() : date.getSeconds();
				// 拼接
				// return year + "-" + month + "-" + day + " " + hours + ":" + minutes + ":" + seconds;
				return year + "-" + month + "-" + day + " " + hours + ":" + minutes + ":" + seconds;
			},
			isPdf(filename) {
				return filename.toLowerCase().endsWith('.docx');
				return filename.toLowerCase().endsWith('.pdf');
			},
			getFileName(filename) {
				return filename.split('/').pop();
			},
			pdfBnt(e) {
				let that = this
				uni.setStorage({
					key: 'link',
					data: that.baseUrl + e,
					success: function() {
						uni.navigateTo({
							url: '/pages/webView/index'
						})
					}
				});
			},
			info() {
				payApplyDetil(this.id).then(res => {
					this.infoDetil = res.data
					if (this.infoDetil.invoicePhoto) {
					this.invoicePhotoList = this.infoDetil.invoicePhoto.split(',').map(photo => photo.trim()); // 新增: 将发票照片按逗号分隔并去除空格
										}
					console.log('详情')
				})
			},
			inputDialogToggle(e) {
				this.text = e
				this.$refs.inputDialog.open()
			},
			dialogInputConfirm() {
				this.infoDetil.assessOpinion = '111'
				if (this.text = '同意') {
					this.infoDetil.assessStatus = '1'
				} else {
					this.infoDetil.assessStatus = '2'
				}
				payApplyEdit(this.infoDetil).then(res => {
					console.log('成功吗')
				})
			},
		}

	}
</script>

<style lang="scss">
	.content {
		padding: 20rpx;
		padding-bottom: 150rpx;

		.list-box {
			padding: 20rpx;
			background: #ffffff;
			border-radius: 8rpx;

			.title {
				padding-top: 20rpx;
				padding-bottom: 20rpx;
				color: #333;
				font-size: 28rpx;
				font-weight: bold;
			}

			.item-box {
				padding-top: 15rpx;
				padding-bottom: 15rpx;
				padding-left: 10rpx;
				display: flex;
				align-items: center;
				border-top: 1px solid #EDEDED;

				.title {
					color: #999999;
					width: 180rpx;
				}

				.text {
					width: 420rpx;
				}
			}
		}

		.bottom-box {
			position: fixed;
			bottom: 0;
			left: 0;
			width: 750rpx;
			padding: 30rpx;
			padding-bottom: 120rpx;
			height: 120rpx;
			background: #ffffff;
			display: flex;
			justify-content: space-between;

			.bnt {
				color: #ffffff;
				width: 306rpx;
				height: 88rpx;
				display: flex;
				align-items: center;
				justify-content: center;
				border-radius: 10rpx;
				background: #4D8987;
			}
		}
	}
</style>